<template>
	<div class="channel-box" :class="[isShowTopMarginZxjt?'zxjtApp-channel-class':'',$store.state.isMobile ? '' : 'pc-saas-box']"   id="channer-container">
		<!--渲染的内容-->
		<!--<transition name="slide-left" mode="out-in">
        </transition>-->
		<!--动态组件 民生银行登录 or 中银证券风险提示 -->
		<component :is="isComponent" @closeRiskTip="closeCom"></component>
		<keep-alive>
			<router-view v-if="$route.meta.keepAlive"></router-view>
		</keep-alive>
		<router-view v-if="!$route.meta.keepAlive" :key="$route.fullPath"></router-view>
		<div v-if="$store.state.fn_privacy" class="privacy">
			<privacy v-if="$store.state.privacy"></privacy>
		</div>
		<privacyText v-if="isPrivacy"></privacyText>
	</div>
</template>
<script>
import privacyText from './homeComponents/privacyText.vue'
import privacy from './homeComponents/privacy.vue'
import riskTipPage from '../zyzqPages/components/riskTipCom.vue'; //风险提示
import fun from '../util/function'
export default {
	components: {
		riskTipPage,
		privacy,
		privacyText
	},
	data() {
		return {
			isComponent: null,
			MaskProblem: null,
			isPrivacy: false,
			channelClass:''
		}
	},
	computed: {
		privacy() {
			return this.$store.state.privacy
		},
		isShowTopMarginZxjt(){
             return   window.terminal.isZxjtApp  &&  this.$store.state.isShowMarginTop && this.$store.state.appVersionBoolean
			 //return    this.$store.state.isShowMarginTop && this.$store.state.appVersionBoolean
		},
	},
	created() {
		this.$http.get("/h5live/getUserInfo").then((res) => {
			if (res.data.code == "000000") {
				if (res.data.data.enPrivacy == true) {
					//后端存储值为true时说明点击的是同意 更新vuex中的值
					this.$store.state.fn_privacy = false;
					this.$store.state.privacy = false;
				} else {
					// 第一次加载获取本地缓存的privacy 为null时说明是第一次加载并且给缓存赋值
					if (window.terminal.isZxjtqhApp) {//中信建投期货 只有微信展示
						return
					}
					this.$store.state.fn_privacy = true;
					this.$store.state.privacy = true;
					// window.localStorage.setItem(`${this.$channel}_privacy`,true)
				}
			}
		})
		this.getExtParamAndSourse()//获取extParam和sourse并存本地
	},
	mounted () {
		if (this.$channel == 'zxjtqh') {//仅app才会有window.topmargin
			if (window.topmargin) {
				fun.setBarHeight(document.getElementById('channer-container'), window.topmargin)
			} else {
				const tmargin = window.localStorage.getItem('topMargin');
				if (tmargin) {
					fun.setBarHeight(document.getElementById('channer-container'), tmargin)
				}
			}
		}
	},
	methods: {
		closeCom() {
			this.isComponent = null;
		},
		//首次进入首页 检查 风险提示是否阅读
		getRiskTip() {
			this.$http("/zb/live/zy/checkReadHomeTip").then(
				res => {
					if (res.data.code == "000000") {
						if (res.data.data == false) { //要检查
							this.isComponent = riskTipPage
						} else { //已阅读 不需检查
							this.isComponent = null
							this.$store.dispatch("setRiskTip", false)
						}
					} else {
						console.log(res.data.msg)
					}

				},
				err => {
					console.log("get err userinfo ", err);
				}
			)
		},
		getExtParamAndSourse() {
			//获取白名单参数并存本地
			let newExtParam = this.$route.query.extParam//url
			let source = this.$route.query.source
			if (newExtParam || source) {
				sessionStorage.setItem('extParam', newExtParam)
				sessionStorage.setItem('source', source)
			}
		},
	},
	watch: {
		isPrivacy: {
			immediate: true,
			handler: function (val) {
				if (val) {
					this.$router.push(`/${this.$channel}/privacyContent`)
				} else {
					if (window.location.href.includes('privacyContent')) {
						this.$router.go(-1)
					}

				}
			}
		},
		'$route.path'(to, from) {
			if (from.includes('/privacyContent')) {
				this.isPrivacy = false
			}

		},
	}
}
</script>
<style scoped="scoped" lang="less">
.channel-box {
	width: 100%;
	height: 100%;	
	background: white;
	overflow-x: hidden;
	overflow-y: scroll;
	&.zxjtApp-channel-class{
		padding-top: 100px;
		// height: calc(100vh - 70px);
	}
}

.privacy {
	z-index: 999;
}

/*.slide-left-enter {
    opacity: 0;
    -webkit-transform: translate(750px, 0);
    transform: translate(750px, 0);
  }
  .slide-left-enter-active{
    transition: all .4s ease;
  }
  .slide-left-leave-to{
    opacity: 0;
    -webkit-transform: translate(-750px, 0);
    transform: translate(-750px, 0);
  }
  .slide-left-leave-active {
    transition: all .4s ease;
  }*/
/*
body.mongolia_open {
  position: fixed;
  width: 100%;
} */</style>
